<html>

<head>
    <meta charset="utf-8">
    <title>发新贴 - NewbieTown</title>
    <script src="static/js/mdui.min.js"></script>
    <link rel="stylesheet" href="static/css/mdui.min.css">
    <link rel="stylesheet" href="static/editor.md/css/editormd.min.css">
    <script src="static/js/jquery.min.js"></script>
    <script src="static/editor.md/editormd.min.js"></script>
    <link rel="stylesheet" href="static/css/combo.select.css">
</head>

<body class="mdui-appbar-with-toolbar mdui-drawer-body-left">
    <div class="mdui-appbar mdui-appbar-fixed mdui-shadow-8">
        <div class="mdui-toolbar mdui-color-blue">
            <a href="/" class="mdui-typo-headline mdui-col-xs-2">NewbieTown</a>
            <div class="mdui-textfield mdui-textfield-expandable mdui-col-xs-4 mdui-center mdui-hidden-xs-down">
                <button class="mdui-textfield-icon mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">&#xe8b6;</i></button>
                <input class="mdui-textfield-input" type="text" placeholder="客官找点啥?" />
            </div>
            <a href="javascript:;" class="mdui-btn mdui-btn-icon mdui-hidden-xs-down"><i class="mdui-icon material-icons">&#xe0c9;</i></a>
            <a href="javascript:;" class="mdui-btn mdui-btn-icon mdui-hidden-xs-down"><i class="mdui-icon material-icons">&#xe5d4;</i></a> {% if session.signin %}
            <div class="mdui-btn mdui-btn-icon mdui-list-item-avatar mdui-hidden-xs-down mdui-float-right" mdui-menu="{target: '#menu'}">
                <img src="static/avatars/avatar.jpg">
            </div>
            <ul class="mdui-menu" id="menu" style="margin-top: 66px;">
                <li class="mdui-menu-item">
                    <a href="javascript:;" class="mdui-ripple">
                        <i class="mdui-menu-item-icon mdui-icon material-icons mdui-text-color-blue">&#xe851;</i>个人中心
                    </a>
                </li>
                <li class="mdui-menu-item">
                    <a href="javascript:;" class="mdui-ripple">
                        <i class="mdui-menu-item-icon mdui-icon material-icons"></i>Download
                    </a>
                </li>
                <li class="mdui-divider"></li>
                <li class="mdui-menu-item">
                    <a href="javascript:;" class="mdui-ripple">
                        <i class="mdui-menu-item-icon mdui-icon material-icons"></i>Remove
                    </a>
                </li>
                <li class="mdui-menu-item">
                    <a class="mdui-ripple" mdui-dialog="{target: '#signoutDialog'}">
                        <i class="mdui-menu-item-icon mdui-icon material-icons mdui-text-color-purple">&#xe899;</i>登出
                    </a>
                </li>
            </ul>
            {% endif %}
        </div>
    </div>
    <div class="mdui-drawer mdui-drawer-scrollbar" style="overflow-y: hidden;">
        <div class="mdui-list">
            <div class="mdui-collapse-item ">
                <a href="/">
                    <div class="mdui-list-item mdui-ripple">
                        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-blue">&#xe88a;</i>
                        <div class="mdui-list-item-content">首页</div>
                    </div>
                </a>
            </div>
            <div class="mdui-collapse-item ">
                <a href="/groups">
                    <div class="mdui-list-item mdui-ripple">
                        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-deep-orange">&#xe886;</i>
                        <div class="mdui-list-item-content">群组</div>
                    </div>
                </a>
            </div>
            <div class="mdui-collapse-item">
                <a href="/random">
                    <div class="mdui-list-item mdui-ripple">
                        <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-green">&#xe417;</i>
                        <div class="mdui-list-item-content">随机浏览</div>
                    </div>
                </a>
            </div>
            <div class="mdui-divider">
            </div>
            {% if session.signin %}
            <div class="mdui-collapse-item ">
                <div class="mdui-list-item mdui-ripple" mdui-dialog="{target: '#signoutDialog'}">
                    <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-purple">&#xe899;</i>
                    <div class="mdui-list-item-content ">登出</div>
                </div>
            </div>
            {% else %}
            <div class="mdui-collapse-item ">
                <div class="mdui-list-item mdui-ripple" mdui-dialog="{target: '#signinForm'}">
                    <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-purple">&#xe898;</i>
                    <div class="mdui-list-item-content ">登入</div>
                </div>
            </div>
            <div class="mdui-collapse-item ">
                <div class="mdui-list-item mdui-ripple" mdui-dialog="{target: '#signupDialog'}">
                    <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color-brown">&#xe851;</i>
                    <div class="mdui-list-item-content ">注册</div>
                </div>
            </div>
            {% endif %}
        </div>
    </div>
    <div class="mdui-container mdui-shadow-16">
        <form action="/newarticle" method="POST">
            <div class="newArticleForm" style="margin-top: 1%;">
                <div class="mdui-textfield mdui-textfield-floating-label mdui-textfield-has-counter">
                    <label class="mdui-textfield-label">标题</label>
                    <input class="mdui-textfield-input" type="text" name="articletitle" maxlength="200" required>
                    <div class="mdui-textfield-counter"><span class="mdui-textfield-counter-inputed">0</span> / 200</div>
                </div>
                <div class="mdui-textfield" id="editormd">
                    <textarea class="mdui-textfield-input" name="articlecontents"></textarea>
                </div>
                <input type="hidden" id="tag">
                <div class="mdui-textfield" style="overflow: visible;">
                    <script src="static/js/jquery.combo.select.js"></script>
                    <div class="dowebok">
                        <select required>
                            <option>选一个Tag</option>
                                <option value="深圳">深圳</option>
                                <option value="广州">广州</option>
                                <option value="珠海">珠海</option>
                                <option value="惠州">惠州</option>
                                <option value="长沙">长沙</option>
                                <option value="株洲">株洲</option>
                                <option value="岳阳">岳阳</option>
                                <option value="张家界">张家界</option>
                                <option value="南昌">南昌</option>
                                <option value="赣州">赣州</option>
                                <option value="宜春">宜春</option>
                                <option value="九江">九江</option>
                        </select>
                    </div>
                    <script>
                        $(function() {
                            $('select').comboSelect();
                        });
                        $('select').change(function(e, v) {
                            $('#tag').val(e.target.value);
                        });
                    </script>
                </div>
                <button class="mdui-btn mdui-btn-raised mdui-btn-dense mdui-color-blue mdui-ripple mdui-btn-block" type="submit">朕写完了, 发布吧~</button>
            </div>
        </form>
        <div class="mdui-dialog" id="signoutDialog">
            <div class="mdui-dialog-title mdui-color-light-blue mdui-text-color-white">真的打算走了?</div>
            <div class="mdui-dialog-content">轻轻的你走了, 正如你轻轻的来, 你挥一挥手, 不带走一片云彩.../(ㄒoㄒ)/~~<br>虽然万分不舍, 但是我还是会对你说:<span class="mdui-text-color-pink">"客官, 有空常来玩~~O(∩_∩)O"</span></div>
            <div class="mdui-dialog-actions">
                <a href="/signout"> <button class="mdui-btn mdui-ripple mdui-hoverable mdui-float-left mdui-btn-raised">嗯, 非走不可了</button></a>
                <button class="mdui-btn mdui-ripple mdui-color-blue mdui-hoverable mdui-btn-raised" mdui-dialog-close>算了, 我再留下来看看</button>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function() {
            var testEditor = editormd("editormd", {
                markdown: "",
                height: "60%",
                emoji: true,
                saveHTMLToTextarea: true,
                path: 'static/editor.md/lib/',
                // imageUpload: true,
                // imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
                // imageUploadURL: "/imageupload",

                /*
                    上传的后台只需要返回一个 JSON 数据，结构如下：
                    {
                    success : 0 | 1,           // 0 表示上传失败，1 表示上传成功
                    message : "提示的信息，上传成功或上传失败及错误信息等。",
                    url     : "图片地址"        // 上传成功时才返回
                    }
                    */
            });
        });
    </script>
</body>

</html>
